﻿@charset 'utf-8';
@keyframes imgshake{
	10%{transform:rotate(20deg);-webkit-transform:rotate(20deg);}
	20%{transform:rotate(-10deg);-webkit-transform:rotate(-10deg);}
	30%{transform:rotate(5deg);-webkit-transform:rotate(5deg);}
	40%{transform:rotate(-5deg);-webkit-transform:rotate(-5deg);}
	50%, 100%{transform:rotate(0deg);-webkit-transform:rotate(0deg);}
}
@-webkit-keyframes imgshake{
	10%{transform:rotate(20deg);-webkit-transform:rotate(20deg);}
	20%{transform:rotate(-10deg);-webkit-transform:rotate(-10deg);}
	30%{transform:rotate(5deg);-webkit-transform:rotate(5deg);}
	40%{transform:rotate(-5deg);-webkit-transform:rotate(-5deg);}
	50%, 100%{transform:rotate(0deg);-webkit-transform:rotate(0deg);}
}

.header .nav dl dd a i:hover,
.header .right .box .img:hover{animation:imgshake 1.5s linear infinite;-webkit-animation:imgshake 1.5s linear infinite;}
/*--------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------*/
.ico_off i:before{transform:rotate(45deg);-webkit-transform:rotate(45deg);}
/*--------------------------------------------------------------------------------*/
.ico_off i:after{transform:rotate(-45deg);-webkit-transform:rotate(-45deg);}
/*--------------------------------------------------------------------------------*/
.ico_off:hover i{transform:rotate(90deg);-webkit-transform:rotate(90deg);}
/*--------------------------------------------------------------------------------*/
.soubox .info{transform:translateY(-50%);-webkit-transform:translateY(-50%);}
/*--------------------------------------------------------------------------------*/
/*.header .right .box .img img{transform:translateY(-100px);-webkit-transform:translateY(-100px);}*/
/*--------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------*/
.meaubox{-webkit-clip-path:ellipse(0 0 at 100% 0);clip-path:ellipse(0 0 at 100% 0);}
.meaubox.on{-webkit-clip-path:ellipse(110% 300% at 100% 0);clip-path:ellipse(110% 300% at 100% 0);}
/*--------------------------------------------------------------------------------*/
.ico_off i,
.header .nav li .a1:before,
.header .nav li .a1:after,
.header .nav li dl,
.soubox,
.meaubox,
.meaubox .list li,
.meaubox .list li i{transition:all .5s;-webkit-transition:all .5s;}
/*--------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------*/
.logobox{font-size:0;}
.logobox .box{display: inline-flex;display:-webkit-inline-flex; vertical-align:top;height:100%;}
.logobox a{align-items:center;padding-right:15px;margin-right:15px;}
.logobox a img{max-width:100%;max-height:50px;}
.logobox a:before{content:'';width:1px;position:absolute;top:30%;bottom:30%;right:0;background:rgba(255,255,255,.3);}
.logobox dl{flex-direction:column;justify-content:center;}
.logobox dl dd{line-height:20px;font-size:14px;}

@media (max-width:1410px){	
	.logobox a img {max-height:45px;}
	.logobox a {padding-right: 10px;margin-right: 10px;}
}
@media (max-width:1300px){
	.logobox a img {max-height:40px;}
	.logobox dl dd {font-size: 12px;}
}
/*-------------------------------------------------------------------------------*/
.ico_off{display:block;top:45px;right:60px;position:absolute;color:#d30111;font-size:13px;line-height:20px;z-index:90;text-transform:uppercase;margin-top:-10px;padding-left:20px;font-weight:lighter;cursor:pointer;}
.ico_off i{display:block;width:20px;height:20px;position:absolute;top:0;left:0;}
.ico_off i:before,
.ico_off i:after{content:'';background:#d30111;position:absolute;width:14px;height:1px;top:50%;left:50%;margin-left:-7px;}

@media (max-width:1510px){.ico_off{right:30px;}}
@media (max-width:1410px){.ico_off{right:10px;}}
/*-------------------------------------------------------------------------------*/
.bgbox{width:100%;height:100%;position:absolute;top:0;left:0;background:#fff;}
.bgbox:before,
.bgbox:after{content:'';width:100%;height:100%; position:absolute; top:0; left:0;}
.bgbox:before{background:url(../img/bg/top.jpg) no-repeat center/cover;opacity:.3; z-index:2;}
.bgbox:after{background:rgba(18,33,51,.9); z-index:5;}
/*-------------------------------------------------------------------------------*/
body:before, .header{height:90px;}
body:before{content:'';clear:both;width:100%;}
.header{width:100%;z-index:99;color:#fff;position:fixed;left:0;top:0;padding:0 60px;background:rgba(211,1,17,.85);}
.header .fl, .header .fr{height:100%;}

.header .nav{font-size:0;margin:0 30px;}
.header .nav li{display:inline-flex;display:-webkit-inline-flex;height:100%;align-items:center;}
.header .nav li a{position:relative;}
.header .nav li .a1{display:block;padding:0 10px;font-size:14px;line-height:24px;}
.header .nav li .a1:before,
.header .nav li .a1:after{content:'';width:0;height:0;position:absolute;border-color:#fff;border-style:solid;border-width:0;}
.header .nav li .a1:before{left:-1px;top:0;}
.header .nav li .a1:after{right:-1px;bottom:0;}
.header .nav li.on .a1{color:#f5ed01;}
.header .nav li:hover .a1:before,
.header .nav li:hover .a1:after{width:6px;height:6px;}
.header .nav li:hover .a1:before{border-width:2px 0 0 2px;}
.header .nav li:hover .a1:after{border-width:0 2px 2px 0;}

.header .nav li dl{visibility:hidden;opacity:0;}
.header .nav li:hover dl{visibility:visible;opacity:1;}
.header .nav dl{display:block;padding:20px 60px;position: fixed;z-index: 15;left: 0;right: 0;top:90px;background:rgba(211,1,17,.85);}
.header .nav dl:before{content:'';width:100%;height:1px;position:absolute;top:0;left:0;background:rgba(255,255,255,.1);}
.header .nav dl dd{ display:block;width:100%; margin:0 auto; width:100%;text-align: center;font-size: 0;}
.header .nav dl dd a{display:inline-block;margin-right:60px;}
.header .nav dl dd a:last-child{margin-right:0;}
.header .nav dl dd a i{display:block;overflow:hidden;}
.header .nav dl dd a i img{display:block;margin:0 auto;height:30px;width:auto;filter:brightness(2);}
.header .nav dl dd a p{font-size:14px;color:#fff;line-height:20px;}
.header .nav dl dd a:hover p{color:#f5ed01;}

.header .right .box{display:flex;display:-webkit-flex;align-items:center;overflow:hidden;}
.header .right .box .img{cursor:pointer;}
/*.header .right .box .img img{filter:drop-shadow(0 100px 0 #d30111);-webkit-filter:drop-shadow(0 100px 0 #d30111);}*/
.header .right .box.tel{padding-right:30px;}

.header .tel p{font-size:14px;line-height:24px;font-weight:bolder;}
.header .tel .img{height:16px;margin-right:5px;}
.header .tel .img img{ height:100%;width:auto;}

.header .sou{cursor:pointer;}
.header .sou .img img{max-width:20px;max-height:100%;}

.header .meau{width: 30px;cursor: pointer;justify-content: center;flex-direction: column;}
.header .meau i{display: block;width: 100%;height: 1px;background: #fff;margin:4px 0;}

@media (max-width:1510px){
	.header{ padding:0 30px;}
	.header .nav{ margin:0 20px;}
	.header .sou {margin:0 20px;}
}
@media (max-width:1410px){
	.header{ padding:0 10px;}
	.header .nav{ margin:0 10px;}
	.header .sou {margin:0 10px;}
	.header .meau{width:24px;}
	.header .meau i{ margin:3px 0;}
}
@media (max-width:1300px){
	.header .right .box.sou{ display:none;}
	.header .nav li .a1{font-size: 13px;}	
	.header .meau{ margin-left:10px;}
}
@media (max-width:1200px){.header .nav{ display:none;}}
/*-------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------*/
.soubox{width:100%;height:100%;position:fixed;top:-100%;left:0;z-index:9999;background:#fff;color:#fff;visibility:hidden;}
.soubox.on{top:0;visibility:visible;}
.soubox .info{width:100%;height:auto;text-align:center;position:absolute;top:50%;left:0;}
.soubox .cn{font-size:34px;}
.soubox .en{font-size:22px;font-weight:lighter;letter-spacing:1px;word-spacing:5px;}
.soubox form{display:block;width:700px;position:relative;margin:40px auto 0;padding-right:55px;}
.soubox input{display:block;font-size:14px;line-height:20px;color:#333;}
.soubox input[type="text"]{width:100%;background:#fff;padding:15px 20px;}
.soubox input[type="submit"]{width:50px;height:100%;position:absolute;top:0;right:0;background:url(../img/icos/search.png) #d30111 no-repeat center/26px;cursor:pointer;}
/*-------------------------------------------------------------------------------*/
.meaubox{position:fixed;z-index:99999;top:0;right:0;width:100%;height:100%;}
.meaubox .bgbox:before{opacity:1;}
.meaubox .bgbox:after{ display:none;}
.meaubox .info{width:100%;height:100%;position:relative; overflow:hidden;}
.meaubox .logobox{padding:0 60px;background:rgba(255,255,255,.95);height:90px;border-bottom:1px #ddd solid;}
.meaubox .logobox a img{filter: brightness(0);-webkit-filter: brightness(0);}
.meaubox .logobox a:before {background: rgba(0,0,0,.3);}
.meaubox .list{width:100%;height:100%;position:relative;text-align:center;font-size:0;display:flex;display:-webkit-flex;justify-content: space-between;}
.meaubox .list li{ width:100%;height:100%;display:inline-block;vertical-align:top;position:relative;text-align:center;padding-top:100px;background:rgba(255,255,255,.92);}
.meaubox .list li:hover{background:rgba(18,33,51,.95);color:#fff;}
.meaubox .list li a{ display:block;position:relative;width:100%;}
.meaubox .list li .a1{font-size:24px;color:#000;padding-bottom:35px;margin-bottom:30px;}
.meaubox .list li .a1 em{display:block;font-size:12px;color:#666;text-transform:uppercase;line-height:1em;margin-top:5px;height:2em;overflow:hidden;}
.meaubox .list li .a1:before{ content:'';width:20px;height:2px;position:absolute;bottom:0;left:50%;margin-left:-10px;background:#d30111;}
.meaubox .list li:hover .a1{color:#fff;}
.meaubox .list li:hover .a1 em{color:#ccc;}
.meaubox .list li .a2{font-size:16px;line-height:2em;}
.meaubox .list li .a2:hover{ color:#d30111;}
.meaubox .list li i{ position:absolute;width:100%;bottom:0;left:0;color:#fff;font-size:30px;font-weight:bolder;line-height:2em;}
.meaubox .list li:hover i{ bottom:100px;}

@media (max-width:1510px){
	.meaubox .logobox{padding:0 30px;}
	.meaubox .list li{padding-top:80px;}
	.meaubox .list li .a1{font-size:20px;padding-bottom: 10px;margin-bottom: 20px;}
	.meaubox .list li .a2{font-size:14px;}
	.meaubox .list li i{font-size:24px;}
}
@media (max-width:1410px){
	.meaubox .logobox{padding:0 10px;}
	.meaubox .list li{padding-top:60px;}
	.meaubox .list li .a1{font-size:18px;}
	.meaubox .list li .a2{font-size:13px;}
	.meaubox .list li i{font-size:20px;}
}